<template>
  <!-- 二级路由出口 -->
  <router-view></router-view>
  <van-tabbar v-show="tabbarVisible" route v-model="active">
    <van-tabbar-item to="/home" icon="shop-o">首页</van-tabbar-item>
    <van-tabbar-item to="/cate" icon="list-switching">分类</van-tabbar-item>
    <van-tabbar-item to="/cart" icon="cart-o" :badge="cartGoodsCount"
      >购物车</van-tabbar-item
    >
    <van-tabbar-item to="/ucenter" icon="user-o">我的</van-tabbar-item>
  </van-tabbar>
</template>

<script setup>
import { storeToRefs } from "pinia";
import useCartStore from "@/store/cartStore";
import { watch,ref, onMounted } from "vue";
import { useRoute } from "vue-router";
const cartStore = useCartStore();
const { cartGoodsCount } = storeToRefs(cartStore);
const {getCartList}=cartStore;
const route = useRoute();
const active = ref(0);
const tabbarVisible = ref(true);
watch(
  () => {
    return route.path;
  },
  (newPath) => {
    if (newPath == "/login" || newPath === "/register") {
      tabbarVisible.value = false;
    } else {
      tabbarVisible.value = true;
    }
  }
);
onMounted(()=>{
    getCartList();
});
</script>